<!DOCTYPE html>
{% load staticfiles %}
<!--{% load static %}-->
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>欢迎登录我的毕业设计</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="http://cdn.javaex.cn/javaex/pc/css/icomoon.css" rel="stylesheet" />
<!--图标库-->
<!-- <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css'> -->
<link rel='stylesheet' href='../../static/css/all.min.css'>

<!--响应式框架-->
<link rel='stylesheet' href='../../static/css/bootstrap.min.css'>

<!--主要样式-->
<link rel="stylesheet" href="../../static/css/page_style.css">


</head>
<body>
	
<div class="container">

	<div class="card-wrap">
	
		<div class="card border-0 shadow card--welcome is-show" id="welcome" style="background-image: url(../../static/img/timg4.jpg); background-repeat:no-repeat;background-size: cover;">
			<div class="card-body">				
				<!-- <h2 class="card-title">欢迎使用大学生心理分析系统</h2> --> <h2 class="card-title" style="color: white; text-shadow:2px 2px 0px rgba(0,0,0,0.5)">欢迎使用大学生心理分析系统</h2>
				<p style="color: white;">欢迎进入登录页面</p>
				<div class="btn-wrap"><a class="btn btn-lg btn-register js-btn" data-target="register">注册</a><a class="btn btn-lg btn-login js-btn" data-target="login">登录</a></div>
				<p style="color:red;">{{ message }}</p>
			</div>
		</div>
		
		<div class="card border-0 shadow card--register" id="register" style="background-image: url(../../static/img/u=3497269101,1986279171&fm=26&gp=0.jpg);background-repeat: no-repeat;background-size: cover;">
			<div class="card-body">
				<h2 class="card-title" style="text-shadow:2px 2px 0 #000000;">用户注册</h2>
				<p class="card-text">第三方注册</p>
				<p class="badge-wrap"><a class="badge"><i class="fab fa-facebook-f"></i></a><a class="badge"><i class="fab fa-google"></i></a><a class="badge"><i class="fab fa-twitter"></i></a><a class="badge"><i class="fab fa-github"></i></a><a class="badge"><i class="fab icon-qq"></i></a><a class="badge"><i class="fab icon-wechat"></i></a></p>
				<p>或者使用您的电子邮箱进行注册</p>
				<form action = "/register/" method = "post" enctype="multipart/form-data"> 
				{% csrf_token %}
					<div class="form-group">
						<input class="form-control" id="username" type="text"  name="username" placeholder="名称" required="required" value="">
					</div>
					<div class="form-group">
						<input class="form-control" id="email" type="email" name="email" placeholder="邮箱" required="required">
					</div>
					<div class="form-group">
						<input class="form-control" type="password" name="password" placeholder="密码" required="required">
					</div>
					<input type="submit"  class="btn btn-lg" value = "注册">
				</form>

			</div>
			<button class="btn btn-back js-btn" data-target="welcome"><i class="fas fa-angle-left"></i></button>
		</div>
		
		<div class="card border-0 shadow card--login" id="login" style="background-image: url(../../static/img/timg2.jpg);">
			<div class="card-body">
				<h2 class="card-title" style="color: white;">祝您使用愉快！</h2>
				<p style="color: white;">第三方登录</p>
				<p class="badge-wrap"><a class="badge"><i class="fab fa-facebook-f"></i></a><a class="badge"><i class="fab fa-google"></i></a><a class="badge"><i class="fab fa-twitter"></i></a><a class="badge"><i class="fab fa-github"></i></a><a class="badge"><i class="icon-qq"></i></a><a class="badge"><i class="icon-wechat"></i></a></p>
				<p style="color: white;">账户或用邮箱登录</p>
				<form action="/login/" method = "post" enctype="multipart/form-data">
					{% csrf_token %}
					<div class="form-group">
						<input id="email" class="form-control" type="text" name="email" placeholder="用户名/邮箱" required="required">
					</div>
					<div class="form-group">
						<input class="form-control" type="password"  name="password" placeholder="密码" required="required">
					</div>
					<p><a href="/alterpd/" style="color: white; text-shadow: 1px 1px 0 black;">忘记密码?</a></p>
					<input type="submit" class="btn btn-lg" value="登录">
				</form>
			</div>
			<button class="btn btn-back js-btn" data-target="welcome"><i class="fas fa-angle-left"></i></button>
		</div>
	</div>
</div>

<script src="../../static/js/myjs.js"></script>
<script>
		var dict = {{ dict|safe }}
		if (dict.message != null) {
			document.getElementById("username").value = dict['username']
			document.getElementById("email").value = dict['email']
			}
		if(dict.username == undefined){
			document.getElementById("username").value = dict['email']
		}
		if(dict.email == undefined){
			document.getElementById("email").value = dict['username']
		}
	</script>
</body>
</html>